<!DOCTYPE html>
<html>
<head>
    <title>SwiftShadow Settings</title>
    <link href="popup.css" rel="stylesheet">
</head>
<body>
<h1>SwiftShadow Settings</h1>

<div class="settings-section">
    <h2>Encrypted Storage</h2>
    <p>Test encrypted storage for sensitive information:</p>
    <input id="sensitiveInput" placeholder="Enter sensitive data..." style="width: 200px; margin: 5px;" type="text">
    <button id="saveSensitiveButton">Save Encrypted</button>
    <div id="displaySensitiveData"
         style="margin-top: 10px; padding: 10px; background-color: #f0f0f0; border-radius: 4px;">
        No data saved.
    </div>
</div>

<div class="settings-section">
    <h2>Smart Categorization</h2>
    <p>Configure automatic file categorization based on file types and custom rules:</p>

    <div style="margin-bottom: 15px;">
        <label>
            <input id="enableCategorization" style="margin-right: 8px;" type="checkbox">
            Enable Smart Categorization
        </label>
    </div>

    <div id="categorizationSettings" style="display: none;">
        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">File Type Rules</h3>
        <div id="fileTypeRules">
            <!-- File type rules will be dynamically added here -->
        </div>
        <button id="addFileTypeRule" style="margin-top: 10px;">Add File Type Rule</button>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Custom Tags</h3>
        <div style="margin-bottom: 10px;">
            <input id="newTagInput" placeholder="Enter new tag name..." style="width: 150px; margin-right: 5px;"
                   type="text">
            <button id="addTagButton">Add Tag</button>
        </div>
        <div id="customTags">
            <!-- Custom tags will be displayed here -->
        </div>

        <div style="margin-top: 15px;">
            <button id="saveCategorization">Save Settings</button>
            <button id="resetCategorization" style="background-color: #dc3545;">Reset to Default</button>
        </div>
    </div>
</div>

<div class="settings-section">
    <h2>File Verification</h2>
    <p>Configure file integrity verification to ensure download quality:</p>

    <div style="margin-bottom: 15px;">
        <label>
            <input id="enableFileVerification" style="margin-right: 8px;" type="checkbox">
            Enable File Verification
        </label>
    </div>

    <div id="fileVerificationSettings" style="display: none;">
        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Verification Types</h3>
        <div style="margin-bottom: 15px;">
            <label style="display: block; margin-bottom: 5px;">
                <input id="enableMD5" style="margin-right: 8px;" type="checkbox">
                MD5 Hash Verification
            </label>
            <label style="display: block; margin-bottom: 5px;">
                <input id="enableSHA1" style="margin-right: 8px;" type="checkbox">
                SHA1 Hash Verification
            </label>
            <label style="display: block; margin-bottom: 5px;">
                <input id="enableSHA256" style="margin-right: 8px;" type="checkbox">
                SHA256 Hash Verification
            </label>
            <label style="display: block; margin-bottom: 5px;">
                <input id="enableSizeCheck" style="margin-right: 8px;" type="checkbox">
                File Size Verification
            </label>
        </div>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Failure Handling</h3>
        <div style="margin-bottom: 15px;">
            <label style="display: block; margin-bottom: 5px;">
                <input id="actionWarn" name="failureAction" style="margin-right: 8px;" type="radio" value="warn">
                Show Warning Only
            </label>
            <label style="display: block; margin-bottom: 5px;">
                <input id="actionBlock" name="failureAction" style="margin-right: 8px;" type="radio" value="block">
                Block Download
            </label>
            <label style="display: block; margin-bottom: 5px;">
                <input id="actionRetry" name="failureAction" style="margin-right: 8px;" type="radio" value="retry">
                Retry Download (up to 3 times)
            </label>
        </div>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Advanced Settings</h3>
        <div style="margin-bottom: 15px;">
            <label style="display: block; margin-bottom: 10px;">
                Verification Timeout (seconds):
                <input id="verificationTimeout" max="300" min="5" style="width: 80px; margin-left: 10px;" type="number"
                       value="30">
            </label>
            <label style="display: block; margin-bottom: 10px;">
                <input id="enableVerificationLogs" style="margin-right: 8px;" type="checkbox">
                Enable Verification Logging
            </label>
            <label style="display: block; margin-bottom: 10px;">
                <input id="autoVerifyLargeFiles" style="margin-right: 8px;" type="checkbox">
                Auto-verify files larger than 100MB
            </label>
        </div>

        <div style="margin-top: 15px;">
            <button id="saveFileVerification">Save Settings</button>
            <button id="resetFileVerification" style="background-color: #dc3545;">Reset to Default</button>
        </div>
    </div>
</div>

<div class="settings-section">
    <h2>Custom Request Headers</h2>
    <p>Configure custom HTTP headers for enhanced download control and authentication:</p>

    <div style="margin-bottom: 15px;">
        <label>
            <input id="enableCustomHeaders" style="margin-right: 8px;" type="checkbox">
            Enable Custom Request Headers
        </label>
    </div>

    <div id="customHeadersSettings" style="display: none;">
        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Global Headers</h3>
        <p style="font-size: 13px; color: #666; margin-bottom: 10px;">These headers will be applied to all
            downloads:</p>

        <div id="globalHeaders">
            <!-- Global headers will be dynamically added here -->
        </div>

        <div style="margin-bottom: 20px;">
            <input id="newGlobalHeaderName" placeholder="Header name (e.g., User-Agent)"
                   style="width: 150px; margin-right: 5px;"
                   type="text">
            <input id="newGlobalHeaderValue" placeholder="Header value" style="width: 200px; margin-right: 5px;"
                   type="text">
            <button id="addGlobalHeader">Add Global Header</button>
        </div>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Domain-Specific Headers</h3>
        <p style="font-size: 13px; color: #666; margin-bottom: 10px;">Configure headers for specific domains or URL
            patterns:</p>

        <div id="domainHeaders">
            <!-- Domain-specific headers will be dynamically added here -->
        </div>

        <div style="margin-bottom: 20px;">
            <input id="newDomainPattern" placeholder="Domain pattern (e.g., *.example.com)"
                   style="width: 150px; margin-right: 5px;"
                   type="text">
            <input id="newDomainHeaderName" placeholder="Header name" style="width: 120px; margin-right: 5px;"
                   type="text">
            <input id="newDomainHeaderValue" placeholder="Header value" style="width: 150px; margin-right: 5px;"
                   type="text">
            <button id="addDomainHeader">Add Domain Header</button>
        </div>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Header Templates</h3>
        <p style="font-size: 13px; color: #666; margin-bottom: 10px;">Quick add common headers:</p>

        <div style="margin-bottom: 20px;">
            <select id="headerTemplate" style="width: 200px; margin-right: 10px;">
                <option value="">Select a template...</option>
                <option value="user-agent-chrome">User-Agent (Chrome)</option>
                <option value="user-agent-firefox">User-Agent (Firefox)</option>
                <option value="user-agent-safari">User-Agent (Safari)</option>
                <option value="referer">Referer</option>
                <option value="authorization-bearer">Authorization (Bearer Token)</option>
                <option value="authorization-basic">Authorization (Basic Auth)</option>
                <option value="accept-json">Accept (JSON)</option>
                <option value="content-type-json">Content-Type (JSON)</option>
                <option value="x-requested-with">X-Requested-With</option>
            </select>
            <button id="applyTemplate">Apply Template</button>
        </div>

        <h3 style="font-size: 16px; margin: 15px 0 10px 0;">Import/Export</h3>
        <div style="margin-bottom: 20px;">
            <button id="exportHeaders" style="margin-right: 10px;">Export Headers</button>
            <input accept=".json" id="importHeadersFile" style="display: none;" type="file">
            <button id="importHeaders">Import Headers</button>
        </div>

        <div style="margin-top: 15px;">
            <button id="saveCustomHeaders">Save Settings</button>
            <button id="resetCustomHeaders" style="background-color: #dc3545;">Reset to Default</button>
        </div>
    </div>
</div>

<button id="backToPopup">Back to Popup</button>
<script src="settings.js"></script>
</body>
</html>